import React from 'react'

// ref 非受控组件 真实数据在DOM中
// state  

class Forms extends React.Component {
    constructor(props) {
        super(props)
        this.handleSubmit = this.handleSubmit.bind(this)
    }
    handleSubmit(event) {
        this.props.onAddComment(this.textInput.value)
        this.textInput.value = "";
        event.preventDefault()
    }

    render() {
        return (
            <form className="p-2" onSubmit={this.handleSubmit} >
                <div className="form-group">
                    <label>评论内容 ref非受控组件</label>
                    <input type="text" className="form-control" ref={ (textInput) => this.textInput = textInput}/>
                </div>
                <button className="btn btn-primary"  type="submit">确定</button>
            </form>
        )
    }
}

export default Forms